﻿@using PTop.Code
@model PTop.Front.Areas.Qn.Models.QnPaperModel
@{
    Layout = null;
}
<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <!-- 指定多核浏览器用webkit模式 -->
    <meta name="renderer" content="webkit">
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta name="format-detection" content="telephone=no">
    <title>@(Model.QnPaper.F_Title)-问卷调查</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <link rel="stylesheet" type="text/css" href="/Content/quest/page_survey.css">
</head>
<body class="g_wrapper page_survey g_survey">
    <p id="detect_item" style="opacity:0;position:absolute;left:0px;top:0px;z-index:-1;" tabindex="0">欢迎回答腾讯问卷</p>
    <!--微信 qq 抓取的icon-->
    <img src="/Content/quest/wx_share_logo.png" alt="" aria-hidden="true" style="position: absolute; left: -2000px;">
    <!-- 敏感问卷黄条警告信息 -->
    <div class="mod_warning_info">
        <i class="ico_warn"></i>
        <span class="text"></span>
    </div>
    <!-- 抽奖模块 -->
    <div class="mod_reward_bar"></div>
    <!-- 问卷主体 -->
    <div id="container" class="g_container">
        <div class="survey_background_wrap"></div>
        <div class="g_content">
            <div class="survey_wrap">
                <div class="survey_main">
                    <!-- 问卷标题 -->
                    <div class="survey_title" style="display: block;">
                        <div class="inner">
                            <div class="title_content"><p>@(Model.QnPaper.F_Title)</p></div>
                        </div>
                    </div>
                    <div class="survey_content">
                        <!-- 问卷欢迎语 -->
                        <div class="survey_prefix" style="display: block;">
                            <div class="inner">
                                <div class="prefix_content">
                                    <p>@(Model.QnPaper.F_Description)</p>
                                </div>
                            </div>
                        </div>
                        <!-- 考试得分 -->
                        <div id="survey_assess_result" class="survey_assess_result" style="display: none;">
                            <div class="inner">
                                <div class="assess_result" style="text-align: center; font-size: 16px;">
                                    <span class="score" style="color: #d92424; margin: 0 2px;">您已经完成此调查问卷</span>
                                </div>
                            </div>
                        </div>
                        <!-- 问卷内容 -->
                        <div class="survey_container">
                            <div class="survey_page" data-pid="1" style="">
                                @for (var i = 0; i < Model.QnQuestions.Length; i++)
                                {
                                    var quest = Model.QnQuestions[i];
                                    if (quest.F_Type == 1)
                                    {
                                        <div class="question question_radio required" id="question_@(i+1)" data-type="radio" data-id="@(i+1)" role="radiogroup" style="display: block;">
                                            <div class="inner">
                                                <div class="title" role="heading" id="questionTitle_@(i+1)" aria-label="第@(i+1)题： @quest.F_Question ">
                                                    <span class="title_index"><span class="question_index" data-for="@(i+1)">@(i + 1)</span>.</span>
                                                    <div class="title_text"><p>@quest.F_Question</p></div>
                                                    <span class="required" title="必答" style="display: none;">*</span>
                                                    <span class="tips"></span>
                                                </div>
                                                <div class="description">
                                                    <div class="description_text"></div>
                                                </div>
                                                <div class="inputs">
                                                    @for (var j = 0; j < quest.F_OptionCont; j++)
                                                    {
                                                        var option = quest.GetOption(j + 1);
                                                        if (string.IsNullOrEmpty(option))
                                                        {
                                                            break;
                                                        }
                                                        <div class="option_item" style="width: 100%;" role="radio">
                                                            <input class="survey_form_checkbox" type="radio" name="answer_@(i+1)" data-oid="@(j+1)" data-exclusive="0" id="option_@(i+1)_@(j + 1)" value="@(j + 1)" />
                                                            <label for="option_@(i+1)_@(j + 1)">
                                                                <i class="survey_form_ui"></i>
                                                                <div class="option_text">
                                                                    <p>@option</p>
                                                                </div>
                                                                <div class="stat">
                                                                    <div class="bar"></div>
                                                                    <span class="rate"></span>
                                                                    <span class="count"></span>
                                                                </div>
                                                            </label>
                                                        </div>
                                                    }
                                                </div>
                                            </div>
                                        </div>
                                    }
                                    else if (quest.F_Type == 2)
                                    {
                                        <div class="question question_radio required" id="question_@(i+1)" data-type="radio" data-id="@(i+1)" role="checkboxgroup" style="display: block;">
                                            <div class="inner">
                                                <div class="title" role="heading" id="questionTitle_@(i+1)" aria-label="第@(i+1)题： @quest.F_Question [多选题]">
                                                    <span class="title_index"><span class="question_index" data-for="@(i+1)">@(i + 1)</span>.</span>
                                                    <div class="title_text"><p>@quest.F_Question</p></div>
                                                    <span class="required" title="必答" style="display: none;">*</span>
                                                    <span class="tips"></span>
                                                </div>
                                                <div class="description">
                                                    <div class="description_text"></div>
                                                </div>
                                                <div class="inputs">
                                                    @for (var j = 0; j < quest.F_OptionCont; j++)
                                                    {
                                                        var option = quest.GetOption(j + 1);
                                                        if (string.IsNullOrEmpty(option))
                                                        {
                                                            break;
                                                        }
                                                        <div class="option_item" style="width: 100%;" role="radio">
                                                            <input class="survey_form_checkbox" type="checkbox" name="answer_@(i+1)" data-oid="@(j+1)" data-exclusive="0" id="option_@(i+1)_@(j + 1)" value="@(j + 1)" />
                                                            <label for="option_@(i+1)_@(j + 1)">
                                                                <i class="survey_form_ui"></i>
                                                                <div class="option_text">
                                                                    <p>@option</p>
                                                                </div>
                                                                <div class="stat">
                                                                    <div class="bar"></div>
                                                                    <span class="rate"></span>
                                                                    <span class="count"></span>
                                                                </div>
                                                            </label>
                                                        </div>
                                                    }
                                                </div>
                                            </div>
                                        </div>
                                    }
                                    else if (quest.F_Type == 3)
                                    {
                                        <div class="question question_star required" data-type="star" id="question_@(i+1)" data-id="@(i+1)" role="radiogroup" style="display: block;">
                                            <div class="inner">
                                                <div class="title" role="heading" id="questionTitle_@(i+1)" aria-label="第@(i+1)题： @quest.F_Question ">
                                                    <span class="title_index">
                                                        <span class="question_index" data-for="@(i+1)">@(i + 1)</span>.
                                                    </span>
                                                    <div class="title_text">
                                                        <p>@quest.F_Question</p>
                                                    </div>
                                                    <span class="required" title="必答" style="display: none;">*</span>
                                                    <span class="tips"></span>
                                                </div>
                                                <div class="description">
                                                    <div class="description_text"></div>
                                                </div>
                                                <div class="inputs">
                                                    <div class="rating_area rating_type_1">
                                                        <span class="star_tip">非常不满意</span>
                                                        @for (var j = 0; j < 5; j++)
                                                        {
                                                            <div class="star_item" role="radio" style="width: 20%;">
                                                                <input name="answer_@(i+1)" type="radio" class="rating survey_form_rating" value="@(j+1)" id="option_@(i+1)_@(j+1)">
                                                                <label for="option_@(i+1)_@(j+1)">
                                                                    <i class="survey_form_ui"></i><span>@(j + 1)</span>
                                                                </label>
                                                            </div>
                                                        }
                                                        <span class="star_tip">非常满意</span>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    }
                                    else if (quest.F_Type == 4)
                                    {
                                        <div class="question question_star required" data-type="textarea" id="question_@(i+1)" data-id="@(i+1)" role="radiogroup" style="display: block;">
                                            <div class="inner">
                                                <div class="title" role="heading" id="questionTitle_@(i+1)" aria-label="第@(i+1)题： @quest.F_Question ">
                                                    <span class="title_index">
                                                        <span class="question_index" data-for="@(i+1)">@(i + 1)</span>.
                                                    </span>
                                                    <div class="title_text">
                                                        <p>@quest.F_Question</p>
                                                    </div>
                                                    <span class="required" title="必答" style="display: none;">*</span>
                                                    <span class="tips"></span>
                                                </div>
                                                <div class="description">
                                                    <div class="description_text"></div>
                                                </div>
                                                <div class="inputs">
                                                    <textarea class="survey_form_input" id="answer_@(i+1)" name="answer_@(i+1)" rows="5" cols="60"></textarea>
                                                </div>
                                            </div>
                                        </div>
                                    }
                                }
                            </div>
                            <div class="survey_page" data-pid="2" style="display:none;">
                            </div>
                        </div>
                        <!-- 问卷结束语 -->
                        <div class="survey_suffix" style="display: none;">
                            <div class="inner">
                                <div class="suffix_content">
                                    <p><img src="/Content/quest/end.png"></p>
                                    <p>&nbsp;</p>
                                    <p>问卷到此结束，感谢您的参与！</p>
                                    <a href="javascript:window.history.back();" class="survey_btn survey_submit" style="display: inline-block;">提交</a>
                                </div>
                            </div>
                        </div>
                        <!-- 问卷操作区域 -->
                        <div class="survey_control">
                            <div class="inner">
                                <a href="javascript:;" class="survey_btn survey_prevpage" style="display: none;">上一页</a>
                                <a href="javascript:;" class="survey_btn survey_submit" style="display: inline-block;">提交</a>
                                <a href="javascript:;" class="survey_btn survey_nextpage" style="display: none; ">下一页</a>
                            </div>
                        </div>
                        <!-- 广告位 -->
                        <div class="survey_ads" style="display: none; padding-top: 30px;">
                            <a target="_blank" href=""></a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div id="loading" style="display: none;">
        <img src="/Content/quest/loading-ffff.gif" alt="正在加载……" style="width: 43px; height: 18px;">
    </div>
    <div id="footer" class="g_footer">
        <div class="g_content">
            <p>© 2017 晋中瑞达公交 系统由<a href="javascript:;">北京智慧云峰</a>提供</p>
        </div>
    </div>
    <script src="~/Content/js/jquery/jquery-2.2.3.min.js"></script>
    <script src="~/Content/js/cookie/jquery.cookie.js"></script>
    <script type="text/javascript" src="~/Content/js/widget/common.js"></script>
    <script type="text/javascript" src="~/Content/quest/quest.js?v=4"></script>
    <script type="text/javascript">
        $(function () {
            quest.initPage("@Model.QnPaper.F_Id", "@Model.QnAnswersStr");
        });

    </script>
    <script src="~/Content/js/weixin/jweixin-1.2.0.js"></script>
    <script>
        @{
            var url = Request.Url.AbsoluteUri.Split('#')[0].Replace(":8081", "");
            //var cfgDic = new WeChatCommon().GetWxConfigDictionary(url);
            var cfgDic = new Dictionary<string, string>();
        }
        wxConfig();
        function wxConfig() {
            wx.config({
                debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
                @*appId: '@Configs.GetValue("WeChatAppId")', // 必填，公众号的唯一标识
                timestamp: '@cfgDic["timestamp"]', // 必填，生成签名的时间戳
                nonceStr: '@cfgDic["noncestr"]', // 必填，生成签名的随机串
                signature: '@cfgDic["signature"]',// 必填，签名，见附录1*@
                jsApiList: [
                    // 所有要调用的 API 都要加到这个列表中
                    'checkJsApi',
                    'openLocation',
                    'getLocation',
                    'onMenuShareTimeline',
                    'onMenuShareAppMessage'
                ]
            });
            wx.ready(function () {
                wx.onMenuShareAppMessage({
                    title: '@Model.QnPaper.F_Title',
                    desc: '@Model.QnPaper.F_Description',
                    link: '@Configs.GetValue("WapHost")/User/QnPaper/Paper?id=@Model.QnPaper.F_Id',
                    mgUrl: '~/Content/image/qnpaper.jpg',
                    type: 'link',
                    dataUrl: '',
                    trigger: function (res) {
                        // 不要尝试在trigger中使用ajax异步请求修改本次分享的内容，因为客户端分享操作是一个同步操作，这时候使用ajax的回包会还没有返回
                        // alert('用户点击发送给朋友');
                    },
                    success: function (res) {
                        //UpdateCount('', 1)
                        //alert('已分享');
                    },
                    cancel: function (res) {
                        //alert('已取消');
                    },
                    fail: function (res) {
                        //alert(JSON.stringify(res));
                    }
                });

                wx.onMenuShareTimeline({
                    title: '@Model.QnPaper.F_Title',
                    desc: '@Model.QnPaper.F_Description',
                    link: '@Configs.GetValue("WapHost")/User/QnPaper/Paper?id=@Model.QnPaper.F_Id',
                    trigger: function (res) {
                        // 不要尝试在trigger中使用ajax异步请求修改本次分享的内容，因为客户端分享操作是一个同步操作，这时候使用ajax的回包会还没有返回
                        // alert('用户点击分享到朋友圈');
                    },
                    success: function (res) {
                        //UpdateCount('', 2)
                    },
                    cancel: function (res) {
                        // alert('已取消');
                    },
                    fail: function (res) {
                        // alert(JSON.stringify(res));
                    }
                });
            });
            wx.error(function (res) {
                //alert("i am error" + res);
            });
            wx.checkJsApi({
                jsApiList: ['chooseImage'], // 需要检测的JS接口列表，所有JS接口列表见附录2,
                success: function (res) {
                    // 以键值对的形式返回，可用的api值true，不可用为false
                    // 如：{"checkResult":{"chooseImage":true},"errMsg":"checkJsApi:ok"}
                    //alert(res);
                }
            });
        }
    </script>
</body>
</html>